$(function () {
    //获取元素
    let $username = $("#username")
    let $number = $("#number")
    let $password = $("#password")
    let $confirm = $("#confirm")
    let $main_reg = $(".main_reg")
    let $myinput = $("input[name='myinput']")
    let $myp = $(".main_reg #alert")
    let $sub = $("#submit")
    let $checkbox = $("#checkbox")
    let validate_type = [
        {
            // 输入框的id值
            id: "username",
            // 是否通过了验证
            type: false
        },
        {
            id: "number",
            type: false
        },
        {
            id: "password",
            type: false
        },
        {
            id: "confirm",
            type: false
        }
    ]


    //获取焦点事件 
    //提示显示
    $.each($myinput, function (index, ele) {

        $(this).focus(function () {

            $(this).attr("placeholder", "").val("").siblings().html($(this).siblings().attr("data-default")).addClass("point").show()
        })

    })

    //失去焦点表单验证
    $.each($myinput, function (index, ele) {

        $(this).blur(function () {

            //用户名验证
            if (index === 0) {

                if (/^.{6,16}$/.test($myinput.eq(0).val())) {
                    $myp.eq(0).html("恭喜你,昵称可以使用").removeClass("point").addClass("success")
                } else {
                    $myp.eq(0).html("昵称不可用,请重新输入").removeClass("point").addClass("fail")
                    return false
                }
                validate_type[0].type = true;

            } else if (index === 1) {

                //验证是不是6-16位字符
                if (!(/^.{6,16}$/).test($myinput.eq(1).val())) {
                    $myp.eq(1).html("输入账号不是6-18位,请重新输入").removeClass("point").addClass("fail")
                    return false
                }

                //首字母英文判定
                if (!(/^[a-z]|[A-Z]/).test($myinput.eq(1).val())) {
                    $myp.eq(1).html("首字母不是英文,请重新输入").removeClass("point").addClass("fail")
                    return false
                } else {

                    $myp.eq(1).html("恭喜你,用户名可以使用").removeClass("point").addClass("success")

                }

                validate_type[1].type = true;

                //密码验证
                //6-16位
                //数字字母符号  至少两种
            } else if (index === 2) {

                //验证是不是6-16位字符
                if (!(/^.{6,16}$/).test($myinput.eq(2).val())) {
                    $myp.eq(2).html("输入密码不是6-18位,请重新输入").removeClass("point").addClass("fail")
                    return false
                }

                //[!@#\$%\^\&\*\(\)]
                let score = 0
                if (/[!@#\$%\^\&\*\(\)]/.test($myinput.eq(2).val())) {
                    score++
                }
                if (/\d/.test($myinput.eq(2).val())) {
                    score++
                }
                if (/[a-zA-Z]/.test($myinput.eq(2).val())) {
                    score++
                }

                if (score >= 2) {
                    $myp.eq(2).html("恭喜你,密码可以使用").removeClass("point").addClass("success")
                } else {
                    $myp.eq(2).html("输入密码少于两种字符,请重新输入").removeClass("point").addClass("fail")
                    return false
                }

                validate_type[2].type = true;

            } else {
                //确认密码验证
                if ($myinput.eq(2).val() === $myinput.eq(3).val()) {
                    $myp.eq(3).html("恭喜你,确认密码成功").removeClass("point").addClass("success")
                } else {
                    $myp.eq(3).html("输入密码与上面不一致,请重新输入").removeClass("point").addClass("fail")
                    return false
                }
                validate_type[3].type = true;

            }
        })

    })

    //提交验证
    $sub.click(function (e = event) {
        $.each(validate_type, function (index, ele) {
            if (!(validate_type[index].type && $checkbox.prop("checked"))) {
                //条件没有达成默认事件
                alert("请确认信息填写完整,并且完成协议阅读")
                e.preventDefault()
                return false
            }
        })
        let opotions = {

            url: "http://127.0.0.1:8888/users/register",
            type: "POST",
            headers: {
                "Content-Type": "application/x-www-form-urlencoded"
            },
            data: {

                nickname: $username.val(),
                username: $number.val(),
                password: $password.val(),
                rpassword: $confirm.val()
            },
            dataType: "json",
            success: function (res) {
                console.log(res);
            },

        }

        $.ajax(opotions)
        .done(function (res) {

                if (res.code === 1) {

                    setTimeout(function () {
                        location.href = "./login.html";
                    }, 2000)
                    alert("恭喜你，注册成功。页面将在两秒之后跳转到登录页面")
                
                }

            })

    })


})